<div class="container container-height100">
    <div class="login">
        <form class="find-box p-50 center-block" [formGroup]="resetPwdForm" (ngSubmit)="resetPwd()">
            <div class="clearfix find-row">
                <div class="w-100 text-right pull-left"><small>密码：</small></div>
                <div class="pull-left po-r form-group" [class.has-error]="(resetPwdForm.hasError('required','Password') || resetPwdForm.hasError('pattern','Password')) && resetPwdForm.get('Password').touched">
                    <input type="password" class="form-control" placeholder="6-11位密码，区分大小写" formControlName="Password">
                    <em [hidden]="resetPwdForm.hasError('required','Password')" class="form-group-del" (click)="clear('Password')"></em>
                </div>
                <div class="login-tips" *ngIf="resetPwdForm.hasError('required','Password') && resetPwdForm.get('Password').touched">
                    <em class="login-tips-warn"></em> 请输入密码
                </div>
                <div class="login-tips" *ngIf="resetPwdForm.hasError('pattern','Password') && resetPwdForm.get('Password').touched">
                    <em class="login-tips-warn"></em> 格式错误，6-11位密码，区分大小写
                </div>
            </div>
            <div class="clearfix find-row">
                <div class="w-100 text-right pull-left"><small>确认密码：</small></div>
                <div class="pull-left po-r form-group" [class.has-error]="(resetPwdForm.hasError('required','PasswordConfirm') || resetPwdForm.hasError('mismatch')) && resetPwdForm.get('PasswordConfirm').touched">
                    <input type="password" class="form-control" placeholder="再次输入密码" formControlName="PasswordConfirm">
                    <em [hidden]="resetPwdForm.hasError('required','PasswordConfirm')" class="form-group-del" (click)="clear('PasswordConfirm')"></em>
                </div>
                <div class="login-tips" *ngIf="resetPwdForm.hasError('required','PasswordConfirm') && resetPwdForm.get('PasswordConfirm').touched">
                    <em class="login-tips-warn"></em> 请再次输入密码
                </div>
                <div class="login-tips" *ngIf="resetPwdForm.hasError('mismatch') && resetPwdForm.get('PasswordConfirm').touched">
                    <em class="login-tips-warn"></em> 确认密码与密码不一致
                </div>
            </div>
            <div class="find-row clearfix">
                <div class="login-tips" *ngIf="error">
                    <em class="login-tips-warn"></em> {{error}}
                </div>
                <div class="w-100 pull-left">&nbsp;</div>
                <div class="form-group pull-left">
                  <button *ngIf="!loading" type="submit" class="btn form-control" [disabled]="!resetPwdForm.valid || error">提交</button>
                  <button *ngIf="loading" type="submit" class="btn form-control" disabled>提交中...</button>
                </div>
            </div>
        </form>
    </div>
</div>
